<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>固定定位（重要）</title>
    <style>
        .daji {
            position: fixed;
            top: 100px;
            right: 40px;
        }
    </style>
</head>
<body>
    <div class="daji">
        <img src="images/pvp.png" alt="">
    </div>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
    <p>请跟随妲己 ，主人</p>
</body>
</html>
<!-- 
    固定定位的特点：
    1.以浏览器的可视窗口为参照点移动元素。
       a.和父元素没有任何关系
       b.不随滚动条滚动
    2.固定定位不占有原先位置。       
      固定定位也是脱标的，其实固定定位也可以看作是一种特殊的绝对定位。
 -->